
import { _decorator, Component, Node, Sprite, SpriteFrame, instantiate, Toggle, Texture2D, ImageAsset, EventTouch, tween, v3, Quat } from 'cc';
import { App } from '../App';
import { EventConst } from '../core/Common';
import { TouchNode } from '../core/components/TouchNode';
const { ccclass, property } = _decorator;
 
@ccclass('Setting')
export class Setting extends Component {
    @property({type:Node})
    skyboxItem:Node = null;
    @property({type:Toggle})
    skyboxIBL:Toggle = null;

    public init() {
        const skyboxContent:Node = this.skyboxItem.parent;
        skyboxContent.removeAllChildren();
        let paths:string[] = [];
        const cfg = App.getValue('skybox');
        for (let i = cfg.range[0]; i <= cfg.range[1]; ++i){
            paths.push(App.Util.format(cfg.files[0],i));
        }
        App.Asset.waitLoad(paths,(file:string,asset:SpriteFrame)=>{
            const item:Node = instantiate(this.skyboxItem);
            item.getComponent(Sprite).spriteFrame = asset;
            skyboxContent.addChild(item);
            const data:string = `Sky_${file.substring(file.lastIndexOf('_')+1,file.length)}`;
            item.getComponent(TouchNode).bindClicket(this.node,'Setting','onSkyBoxClicket',data);
        },SpriteFrame);
    }
    start () {
        // [3]
    }

    onTitleClicket(touch:EventTouch){
        const arrow:Node = touch.target.getChildByName('arrow');
        tween(arrow).to(0.05,{angle:arrow.angle > 0 ? 0 : 90},{easing:'backIn'})
        .call(()=>{
            touch.target.parent.getChildByName('content').active = arrow.angle === 0;
            tween(arrow).stop();
        }).start();
    }

    onSkyBoxClicket(_,idx:string){
        App.Event.emit(EventConst.SET_SKY_BOX_STYLE,idx,this.skyboxIBL.isChecked);
    }
}
